<template>
	<view>
		<view class="cu-card article" :class="isCard?'no-card':''">
			<view class="cu-item shadow">
				<view class="title">
					<view class="text-cut">数据结构</view>
				</view>
				<view class="content">
					<image src="https://pic4.zhimg.com/v2-12e282d5fc7073140a62377eb453728f_1440w.jpg"
					 mode="aspectFit"></image>
					<view class="desc">
						<view> 数据结构是计算机存储、组织数据的方式。数据结构是指相互之间存在一种或多种特定关系的数据元素的集合。通常情况下，精心选择的数据结构可以带来更高的运行或者存储效率。数据结构往往同高效的检索算法和索引技术有关。</view>
					</view>
				</view>
				<view class="base padding flex flex-wrap">
					<view class="padding-xs">数据结构这门课的主要内容包括：\n </view>
					<view class="padding-xs" v-for="(item,index) in contentList" :key="index">
						<view class="cu-tag bg-cyan">{{item.name}}</view>
					</view>
					<image
						@tap="viewImg()"
						style="width: 100%;height: 100vw;" 
						src="cloud://first-xlfs5.6669-first-xlfs5-1302491884/home/cs/sjjgTree.png" 
					>
					</image>
					<view class="padding-xs">
						学习数据结构非常有用，它是计算机从业人员一项重要的基本功。
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isCard: true,
				contentList: [
					{name:'基本概念'},
					{name:'线性表'},
					{name:'栈和队列'},
					{name:'树和二叉树'},
					{name:'图'},
					{name:'查找'},
					{name:'排序'}
				],
				urls: ['cloud://first-xlfs5.6669-first-xlfs5-1302491884/home/cs/sjjgTree.png']
			}
		},
		methods: {
			viewImg(){
				 //图片预览
				uni.previewImage({
				  urls: this.urls, // 当前显示图片的http链接
				  longPressActions: {
					  itemList: ['发送给朋友', '保存图片', '收藏'],
					  success: function(data) {
						  console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
					  },
					  fail: function(err) {
						  console.log(err.errMsg);
					  }
				  }
				})
			}
		}
	}
</script>

<style>

</style>
